<template>
  <el-dialog :visible="showDialog" top="10vh" width="68%" @close="handleClose">
    <template #title>
      <h2 style="text-align: center">
        😏🥶🤬🤢🥸👿👻👽👾🤖💩😾🙈🦓🐴🦄🐔🌭🍟🥨🥯🥖🧑‍🎄🎅
      </h2>
      <h2 style="text-align: center">视频预览</h2>
    </template>
    <el-row>
      <!-- 标题 -->
      <h3>{{ subjectData.title }}</h3>
      <!-- 时间 -->
      <p>
        <span> {{ subjectData.createTime }} </span>
        &nbsp;
        <span> {{ subjectData.username }} </span>
        &nbsp;
        <span><i class="el-icon-view" /> {{ subjectData.visits }} </span>
      </p>
      <p>{{ subjectData }}</p>
    </el-row>
    <el-divider />
    <el-row>
      <keep-alive>
        <video-play
          v-show="true"
          :video-url="videourl"
          :video-cover="videoCover"
          :width="800"
          :height="450"
          :autoplay="true"
          :controls="true"
          :loop="false"
          :muted="true"
          preload="auto"
          :show-play="true"
          :play-width="96"
          zoom="cotain"
        />
      </keep-alive>
      <!-- <video controls autoplay name="media">
        <source :src="subjectData.videoURL" type="video/mp4"></video>
      </video> -->
    </el-row>
    <template #footer>
      <el-button type="primary" @click="handleClose">关闭</el-button>
    </template>
  </el-dialog>
</template>

<script>
import { getInfomationAPI } from '@/api/interview'
import cover from '@/assets/images/reg.png'
import VideoPlay from './VideoPlay.vue'
export default {
  name: 'VideoCom',
  components: { VideoPlay },
  props: {
    showDialog: {
      type: Boolean,
      default: false
    },
    subjectData: {
      type: Object,
      required: true
    }
  },
  data() {
    return {
      videoCover: cover,
      videourl: 'https://v-cdn.zjol.com.cn/277003.mp4'
    }
  },
  created() {
    console.log(this.subjectData, '1')
    console.log(this.videourl)
    this.getInfomation()
  },
  methods: {
    // 获取文章详情
    async getInfomation() {
      const resp = await getInfomationAPI(this.subjectData)
      console.log(resp, '666')
      if (
        resp.data.videoURL !== null ||
        resp.data.videoURL !== '' ||
        resp.data.videoURL !== undefined ||
        resp.data.videoURL !== 'null'
      ) {
        this.videourl = resp.data.videoURL
      }

      console.log(this.videourl, '77')
    },
    // 关闭弹窗
    handleClose() {
      this.$emit('add-success')
      this.$emit('closeDialog')
    }
  }
}
</script>

<style>
</style>
